import Vue from 'vue'
import VueRouter from 'vue-router'


Vue.use(VueRouter)
// 路由配置   作用   用户访问路径和组件的对应关系  /login   ->  LoginView.vue
const routes = [
  //   一级路由  出口 App.vue
  {
    path: '/home',
    redirect: "/home/user",
    name: 'home',
    // @ 表示的就是src目录层级
    component: () => import(/* webpackChunkName: "about" */ '@/views/home/HomeView.vue'),
    children:[
      //  /home/student    二级路由   路由的出口在父路由对应的组件中
      {
        path: 'student',
        name: 'student',
        // @ 表示的就是src目录层级
        component: () => import(/* webpackChunkName: "about" */ '@/views/student/StudentView.vue')
      },
      {
        path: 'user',
        name: 'user',
        // @ 表示的就是src目录层级
        component: () => import(/* webpackChunkName: "about" */ '@/views/user/UserView.vue')
      }
    ]
  },
  {
    path: '/login',
    name: 'login',
    // @ 表示的就是src目录层级
    component: () => import(/* webpackChunkName: "about" */ '@/views/login/LoginView.vue')
  },
  {
    path: '/register',
    name: 'register',
    // @ 表示的就是src目录层级
    component: () => import(/* webpackChunkName: "about" */ '@/views/register/RegisterView.vue')
  },
  {
    path: '/',
    redirect:'/login'  //  用户访问 根路径时  将路径重定向到   /login
  }
]

const router = new VueRouter({
  routes
})

export default router
